<template>
	<uni-nav-bar title="变动明细" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package">
		<view>{{title}}</view>
		<view>{{change}}</view>
	</view>
	<scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="package scroll-box"
		:style="{ height: pageHeight + 'px' }">
		<view class="all" v-for="item in orderLists" :key="item.id">
			<view class="space-between">
				<view>{{item.memo}}</view>
				<view>{{item.amount}}公斤</view>
			</view>
			<view class="space-between top">
				<view>{{item.createtime}}</view>
				<view>当前：{{item.after}}</view>
			</view>
		</view>
		<Popu v-if="orderLists.length<1" :pageHeight="pageHeight" text="暂无盘库变动明细"></Popu>
	</scroll-view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import Popu from '@c/earthPushing/common/popu.vue';
	import { showLoading } from '@/utils/prompt';
	import { onLoad } from '@dcloudio/uni-app';
	import { ref } from 'vue';
	import { toPublish } from '@mqtt';
	import { getAmountChangeList } from '@/gql/warehouse';
	import { format, subDays } from 'date-fns';
	// data
	let end = ref()
	let start = ref()
	const title = ref()
	const change = ref()

	const orderLists = ref([]);
	const lastPage = ref(1);
	const currentPage = ref(1);
	const pageHeight = ref();
	const popup = ref(null)
	const fill_id = ref()

	uni.getSystemInfo({
		success: function (res) {
			pageHeight.value = res.windowHeight - 140;
		},
	});
	onLoad((pearm) => {
		fill_id.value = pearm.id
		end.value = pearm.end
		start.value = pearm.start
		init()
	})
	function init() {
		showLoading()
		const payload = {
			query: getAmountChangeList,
			variables: {
				page: currentPage.value,
				start: start.value,
				end: end.value,
				fill_id: Number(fill_id.value)
			},
		};
		toPublish(
			'ql/control/getAmountChangeList',
			payload,
			(obj : any) => {
				const { getAmountChangeList } = obj.data;
				orderLists.value = [...orderLists.value, ...getAmountChangeList.list];
				lastPage.value = getAmountChangeList.lastpage;
				title.value = getAmountChangeList.title
				change.value = getAmountChangeList.change
			}
		);
	}
	/**
	 * 加载更多
	 */
	function loadMore() {
		if (currentPage.value < lastPage.value) {
			currentPage.value++;
			init();
		}
	}
</script>

<style scoped lang="less">
	.all {
		border-bottom: 1px solid #eee;
		padding: 20rpx 0px;
		box-sizing: border-box;
	}

	.all:nth-last-child(1) {
		border-bottom: 0px;
	}

	.all:nth-of-type(1) {
		padding-top: 0px;
	}

	.top {
		margin-top: 15rpx;
	}
</style>